import React, { Component } from 'react'
import Header from '../../Common/Header'
import { connect } from 'react-redux'
import { qxcollect_action } from '../../../store/store'

class Mysc extends Component {
    render() {
        return (
            <div className="mysc">
                <Header title="我的收藏" back={<span onClick={() => { this.props.history.push({ pathname: '/home' }) }}>&lt;</span>}></Header>
                <div className="content">
                    <div className="list">
                        {
                            this.props.sclist.length > 0
                                ?
                                this.props.sclist.map((item, index) => {
                                    return (
                                        <div className="item" key={index} onClick={() => {
                                            this.props.history.push({ pathname: '/shop', state: item })
                                        }}>
                                            <div className="img">
                                                <img src={item.pic} alt="" />
                                            </div>
                                            <div className="text">
                                                <div className="title">
                                                    {item.title}
                                                </div>
                                                <div className="yxl">
                                                    月销量：{item.yxl}{item.km}km
                                       </div>
                                                <div className="mj">
                                                    <span>满{item.xm}减{item.mj1}</span><span>满{item.dm}减{item.mj2}</span><span>满{item.gm}减{item.mj3}</span>
                                                </div>
                                            </div>
                                            <div className="btn" onClick={(e) => { e.stopPropagation(); this.props.qxsc(item) }}>
                                                取消收藏</div>
                                        </div>
                                    )
                                })
                                :
                                <div className="klist">
                                    <h3 className="k">还没有收藏店铺!!!</h3>
                                    <div onClick={() => { this.props.history.push({ pathname: '/home' }) }} className="gg">
                                        <span>去逛逛</span>
                                    </div>
                                </div>
                        }
                    </div>
                </div>
            </div>
        )
    }
}
export default connect(
    (state) => {
        return {
            sclist: state.sclist
        }
    },
    (dispatch) => {
        return {
            qxsc: (item) => { dispatch(qxcollect_action(item)) }
        }
    }
)(Mysc)